<template>
	<view>

		<view class="p15">
			<!-- 备注 -->
			<uni-card>
				<view class="comment">
					<fuck-textarea placeholder="请输入意见内容:" maxlength="100" v-model="remark"></fuck-textarea>
				</view>
			</uni-card>
			<!-- 上传图片 -->
			<view class="upimage" style="display: flex;align-items: center;flex-wrap: wrap;">
				<view class="img por" v-if="roomImg.length > 0" v-for="(item,index) in roomImg" :key="index">
					<image  class="img" :src="item" mode=""></image>
					<image src="@/static/img/polling/DelectIcon.png" mode="" class="DelectIcon" @click="delectImg(index)"></image>
				</view>
				<image class="img" style="margin-right: 10px;" src="../../../static/img/detailsMsg/imagess.png" mode="" @click="addImages" v-if="roomImg.length < 3"></image>
			</view>
			<button type="default" @click="submitMaintains">提交</button>

		</view>
	</view>
</template>

<script>
	import fuckTextarea from '@/components/fuck-textarea/fuck-textarea.vue'
	import uniTag from "@/components/uni-tag/uni-tag.vue"
	import fault from "@/serve/api/fault.js"
	import submit from "@/serve/api/submit.js"
	import {
		imgSet,
		imgSets
	} from "@/serve/api/imgSet.js"
	export default {
		components: {
			fuckTextarea,
			uniTag
		},
		data() {
			return {
				roomImg: [],
				remark: '',
			}
		},
		onLoad(e) {

		},
		methods: {

			//上传图片
			async addImages() {
				const res = await imgSets("attachment/uploadMore", {
					count: 3 - this.roomImg.length,
				})
				console.log('22222222222',res)
				this.roomImg.push(...res.data.url.split(","))
				
			},
			delectImg(ind){
				this.roomImg.splice(ind,1)
			},

			async submitMaintains(){
				console.log(this.roomImg.length)
				if(!this.remark){
					this.tip('请输入意见内容')
					return
				}
				// else if(this.roomImg.length == 0){
				// 	this.tip('请上传图片')
				// 	return
				// }
				const res = await submit.submitFeedbackMessage({
					feedbackContext:this.remark,
					feedbackImg:this.roomImg.join(",")
				})
				if(res){
					
					uni.navigateBack({})
				}
			},


		}

	}
</script>

<style scoped>
	* {
		margin: 0;
		padding: 0;
	}

	page {
		width: 750rpx;
		background: #EFF2F5;
		overflow: hidden;
	}

	view {
		font-size: 28rpx;
		line-height: 1.8;

	}

	.uni-card {
		width: 100%;
		/* height: 96rpx; */
		background: #FFFFFF;
		box-shadow: 0rpx 10rpx 10rpx 0rpx rgba(52, 54, 61, 0.05);
		border-radius: 16rpx;
		border: none;
		margin: 0 auto;

		margin-top: 20rpx;

	}



	.p15 {
		padding: 0 20px;
		box-sizing: border-box;
	}

	button {
		width: 335px;
		height: 52px;
		background: #017EFE;
		box-shadow: 0px 5px 7px 0px rgba(1, 126, 254, 0.2);
		border-radius: 26px;
		font-size: 18px;
		font-family: PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
		text-align: center;
		line-height: 52px;
		margin: 50px auto 34px;
	}

	/* 上传图片 */
	.upimage {
		margin-top: 20px;
		width: 100%;
		display: flex;
		align-items: center;
	}

	.img {
		/* padding: 20rpx 0; */
		width: 200rpx;
		height: 200rpx;
		border-radius: 16rpx;
		margin-bottom: 20rpx;
		margin-right: 10px;
	}
	.por{
		position: relative;
	}
	.DelectIcon{
		position: absolute;
		width: 48rpx;
		height: 48rpx;
		top: -25rpx;
		right: -25rpx;
	}
</style>
